<include file="public/header" title="注册" body=""/>
<include file="public/header_nav" title="注册" href="javascript:history.back(-1)"/>
<style>
    #verify_code_img{
        padding: .55467rem .21333rem;
        width: 4.6rem;
        height: 2.9rem;
        color: white;
        border-radius: .128rem;
    }
</style>
<div class="logo-wrap-bg">
    <a class="login-logo-wrap" href="#">
        <!--<img src="__STATIC__/images/logo-login.png" alt="LOGO"/>-->
        <img src="{$tpshop_config.shop_info_store_user_logo|default='/public/static/images/logo/pc_home_user_logo_default.png'}" alt="LOGO"/>
    </a>
</div>
<!--注册表单-s-->
<div class="loginsingup-input">
    <form action="" method="post" id="regFrom" >
        <input type="hidden" name="auth_code" value="{$Think.config.AUTH_CODE}"/>
        <input type="hidden" name="is_bind" value="{$Request.param.is_bind}">
        <div class="lsu">
            <span class="ico ico-telephone"></span>
            <input type="text" name="username" id="username" value="" placeholder="请输入手机号"  class="c-form-txt-normal">
            <span id="mobile_phone_notice"></span>
        </div>
        <if condition="$regis_sms_enable eq 1">
            <div class="lsu">
                <span class="ico ico-v-code"></span>
                <input class="v-code-input" type="text" id="mobile_code" value="" name="mobile_code" placeholder="请输入验证码" >
                <a class="btn-text-message" rel="mobile" onClick="sendcode(this)">获取验证码</a>
            </div>
        </if>
        <div class="lsu">
            <span class="ico ico-password"></span>
            <input type="password" id="password" value="" maxlength="16" placeholder="请设置6-16位登录密码" class="c-form-txt-normal" onBlur="check_password();">
            <input type="hidden" name="password" value="" />
            <span id="password_notice"></span>
        </div>
        <div class="lsu">
            <span class="ico ico-password"></span>
            <input type="password" id="password2" value="" maxlength="16" placeholder="确认密码" onBlur="check_confirm_password();">
            <input type="hidden" name="password2" value="" />
            <span id="confirm_password_notice"></span>
        </div>
        <!--<div class="lsu boo zc_se">-->
        <!--<input type="text"  value="" name="verify_code" placeholder="请输入验证码" >-->
        <!--<img src="/index.php?m=Home&c=User&a=verify" id="verify_code_img" onclick="verify()">-->
        <!--</div>-->
        <if condition="$tpshop_config['integral_invite'] eq 1" >
            <div class="lsu">
                <span class="ico ico-referee"></span>
                <input type="text" name="invite" id="invite" value="" placeholder="推荐人手机号(选填)"  class="c-form-txt-normal" >
                <span id="invite_phone_notice"></span>
            </div>
        </if>
        <div class="lsu-submit">
            <input type="button" name="" id="" onclick="checkSubmit()" value="注 册"/>
        </div>
        <div class="signup-find">

            <p class="recept">注册即视为同意<a href="{:U('Mobile/Article/agreement',['doc_code'=>'agreement'])}">《开源用户注册协议》</a></p>
            <!--<p class="recept">注册即视为同意<a href="javascript:show_agreement();">《开源用户注册协议》</a></p>-->
        </div>
    </form>
</div>


<!--注册表单-s-->
<script src="__PUBLIC__/js/md5.min.js"></script>
<script type="text/javascript">
    var flag = true;
    //密码
    function check_password() {
        var password = $.trim($('#password').val());
        var password2 = $.trim($('#password2').val());
        if (password.length < 6 || password.length > 18) {
            showErrorMsg('*登录密码应设置为 6-18 个字符。');
            flag = false;
        }
    }

    //验证确认密码
    function check_confirm_password() {
        var password = $.trim($('#password').val());
        var password2 = $.trim($('#password2').val());
        if (password2.length < 6 || password.length > 18) {
            showErrorMsg('*登录密码应设置为 6-18 个字符。');
            flag = false;
        }else if (password2 != password) {
            showErrorMsg('*两次密码不一致');
            flag = false;
        } else{
            flag = true;
        }
    }
    function countdown(obj) {
        var s = {$tpshop_config['sms_sms_time_out']|default=60};
        //改变按钮状态
        obj.disabled = true;
        callback();
        //循环定时器
        var T = window.setInterval(callback,1000);
        function callback()
        {
            if(s <= 0){
                //移除定时器
                window.clearInterval(T);
                obj.disabled=false;
                obj.innerHTML='获取验证码';
            }else{
                if(s<=10){
                    obj.innerHTML = '0'+ --s + '秒后再获取';
                }else{
                    obj.innerHTML = --s+ '秒后再获取';
                }
            }
        }
    }

    //发送短信验证码
    function sendcode(obj) {
        var mobile = $('#username').val();
        if (mobile == '') {
            showErrorMsg('手机不能空');
            flag = false;
        } else if (checkMobile(mobile)) { //判断手机格式
            $.ajax({
                type: "GET",
                url: "/index.php?m=Home&c=Api&a=issetMobile",//+tab,
                data: {mobile: mobile},// 你的formid 搜索表单 序列化提交
                success: function (data) {
                    if (data == '0') {
                        $.ajax({
                            url: '/index.php?m=Home&c=Api&a=send_validate_code&t=' + Math.random(),
                            type: 'post',
                            dataType: 'json',
                            data: {type: $(obj).attr('rel'), send: $.trim($('#username').val()), scene: 1},
                            success: function (data) {
                                if (data.status == 1) {
                                    //成功
                                    countdown(obj)
                                    layer.open({content: data.msg,time:2});
                                } else {
                                    //失败
                                    showErrorMsg(data.msg);
                                }
                            }
                        })
                        flag = true;
                    } else {
                        showErrorMsg('* 手机号已存在');
                        flag = false;
                    }
                }
            });
        } else {
            showErrorMsg('* 手机号码格式不正确');
            flag = false;
        }
    }
    $(document).on('keyup', '#password', function() {
        var password = md5($("input[name='auth_code']").val() + this.value);
        $('input[name="password"]').val(password);
    })
    $(document).on('keyup', '#password2', function() {
        var password2 = md5($("input[name='auth_code']").val() + this.value);
        $('input[name="password2"]').val(password2);
    })
    // 普通 图形验证码
    //    function verify(){
    //        $('#verify_code_img').attr('src','/index.php?m=Home&c=User&a=verify&type=user_reg&r='+Math.random());
    //    }

    //提交表单
    function checkSubmit()
    {
        check_confirm_password()
        if(flag == false){
            return ;
        }
        var mobile = $('#username').val();
        if(mobile == '' ){
            showErrorMsg('* 手机号码不能为空');
            return false;
        }
        mobile = checkMobile(mobile);
        if(!mobile ){
            showErrorMsg('* 手机号码格式不正确');
            return false;
        }
        $.ajax({
            type:'POST',
            url:"/index.php?m=Mobile&c=User&a=reg",
            dataType:'JSON',
            data:$('#regFrom').serialize(),
            success:function(data){
                if(data.status == 1){
                    location.href='/index.php/Mobile/User/index';
                }else{
                    showErrorMsg(data.msg);
                }
            }
        })
    }
</script>
</body>
</html>
